<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">

<html xmlns="http://www.w3.org/1999/xhtml"
	xmlns:ui="http://java.sun.com/jsf/facelets"
	xmlns:h="http://java.sun.com/jsf/html"
	xmlns:f="http://java.sun.com/jsf/core">
<h:head>
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<title>Untitled Document</title>
	<link rel="stylesheet" type="text/css" href="css/main.css" />
	<link rel="stylesheet" type="text/css" href="css/meniu.css" />
	<link rel="stylesheet" type="text/css" href="css/style.css" />

</h:head>
<h:body>
	<ui:include src="header.xhtml" />
	<h:panelGroup layout="block" id="content">
		<ui:include src="leftMenu.xhtml" />
		<h:panelGroup layout="block" id="contenRight">
			<h:panelGroup layout="block" id="header" style="margin-top: 20px;">
				<ul>
					<li id="selected"><a>Create survey</a></li>
				</ul>
			</h:panelGroup>
			<h:panelGroup layout="block" id="contentTab">

				<h:form id="form" styleClass="aliniereCenterCreateSurvey">
					<h2>
						<h:outputText value="#{surveyDTO.title} " />
					</h2>
					<ui:repeat var="question" value="#{surveyCreateBean.questions}"
						varStatus="index">
						<h:outputText value="#{index.index+1}. #{question.text}"
							style="font-weight:bold;" />

						<h:panelGrid columns="2" styleClass="surveyPanel">
							<ui:repeat var="option" value="#{question.options}">
								<h:selectBooleanCheckbox
									rendered="#{option.type == 'multipleChoice'}" disabled="true">
								</h:selectBooleanCheckbox>
								<h:selectOneRadio rendered="#{option.type == 'singleChoice'}"
									disabled="true">
									<f:selectItem itemLabel="#{option.text}" />
								</h:selectOneRadio>
								<h:outputLabel value=" #{option.text} "
									rendered="#{option.type != 'singleChoice'}" />
								<h:inputText rendered="#{option.type == 'plainText'}"
									value="#{option.textDefault}" disabled="true">
								</h:inputText>

								<h:inputText rendered="#{option.type == 'grade'}"
									value="#{option.textDefault}" disabled="true">
								</h:inputText>
								<h:panelGrid rendered="#{option.type != 'singleChoice'}">
								</h:panelGrid>

							</ui:repeat>
						</h:panelGrid>
					</ui:repeat>


					<!--ADDD NEW QUESTION EZT LATOM MOST!!!  -->
					<h:panelGrid columns="2">
						<h:outputText value="Add new question" style="font-weight: bold;" />
						<h:selectBooleanCheckbox
							value="#{surveyCreateBean.addNewQuestion}" immediate="true">
							<f:ajax event="click" render="newQuestion" execute="question"
								immediate="true" />
						</h:selectBooleanCheckbox>

					</h:panelGrid>
					<h:panelGroup id="newQuestion">
						<h:panelGrid columns="3" id="question"
							rendered="#{surveyCreateBean.addNewQuestion}"
							styleClass="createSurveySubMenu">

							<h:outputText value="Question: " />
							<h:inputText id="questionText" styleClass="inputTextStyle"
								value="#{surveyCreateBean.question}"
								requiredMessage="Add the question!" required="true" />
							<h:outputText value="*" styleClass="inputRed"></h:outputText>

							<h:outputText value="Add new option" style="font-weight: bold;" />
							<h:selectBooleanCheckbox
								value="#{surveyCreateBean.addNewQuestionOption}"
								immediate="true">
								<f:ajax event="click" render="nush" execute="questionOption"
									immediate="true" />
							</h:selectBooleanCheckbox>
							<h:outputText value=" "></h:outputText>
						</h:panelGrid>

						<h:panelGroup id="nush">
							<h:panelGrid columns="3" id="questionOption"
								rendered="#{surveyCreateBean.addNewQuestionOption}"
								styleClass="createSurveySubSubMenu">
								<h:outputText value="Type" />
								<h:selectOneMenu id="qType" value="#{surveyCreateBean.type}"
									styleClass="comboBoxSurvey2">
									<f:selectItem itemValue="plainText" itemLabel="Text" />
									<f:selectItem itemValue="singleChoice"
										itemLabel="Single choice" />
									<f:selectItem itemValue="multipleChoice"
										itemLabel="Multiple choice" />
									<f:selectItem itemValue="grade" itemLabel="Grade" />
								</h:selectOneMenu>
								<h:outputText value=" "></h:outputText>

								<h:outputText value="Text" />
								<h:inputText id="questionOptionText" styleClass="inputTextStyle"
									value="#{surveyCreateBean.optionText}"
									requiredMessage="Add the option text!" required="true" />
								<h:outputText value="*" styleClass="inputRed"></h:outputText>

								<h:outputText value="Default" />
								<h:inputText id="textDefault" styleClass="inputTextStyle"
									value="#{surveyCreateBean.textDefault}" />
								<h:outputText value=" "></h:outputText>

								<h:outputText value=" "></h:outputText>
								<h:outputText value="*fields mandatory" styleClass="inputError"></h:outputText>
								<h:outputText value=" "></h:outputText>

								<h:outputText value=" "></h:outputText>
								<h:commandButton value="Save option"
									styleClass="butoaneAddSurveyOption"
									action="#{surveyCreateBean.createQuestionOption}">
								</h:commandButton>
								<h:outputText value=" "></h:outputText>
							</h:panelGrid>
						</h:panelGroup>
					</h:panelGroup>
					<h:commandButton value="Save question" immediate="true"
						action="#{surveyCreateBean.done}"
						styleClass="butoaneAddSurveyQuestion" />

					<h:panelGrid columns="1">
						<h:message for="questionText" styleClass="inputError" />
						<h:message for="questionOptionText" styleClass="inputError" />
						<h:outputText
							value="Survey has no questions! Please add a question."
							styleClass="inputError" rendered="#{!surveyCreateBean.hasQuestions}"/>
					</h:panelGrid>
				</h:form>
				<h:form>
					<h:panelGrid columns="2">
						<h:outputText value="Destination group:" />
						<h:selectOneMenu value="#{surveyCreateBean.group}">
							<f:selectItems value="#{surveyCreateBean.emailGroups}"
								var="group" itemLabel="#{group.name}" itemValue="#{group.id}" />
						</h:selectOneMenu>

						<h:outputText value=" "></h:outputText>
						<h:commandButton value="Send Email"
							action="#{surveyCreateBean.send}" styleClass="butoaneAddGroup" />
					</h:panelGrid>
				</h:form>
			</h:panelGroup>

		</h:panelGroup>
	</h:panelGroup>
</h:body>
</html>